<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	template="/templates/masterPage.xhtml">
	<ui:define name="content">
		<style type="text/css">
			.panelColumns td {
				vertical-align: top;
			}
		</style>
		<div align="center"
			style="margin: 100px; margin-left: 50px; margin-right: 50px;">
			<h:form id="form">
				<p:growl id="message" life="3000" />
				<p:panelGrid id="repositorySearchGrid" styleClass="panelColumns">
					<p:row>
						<p:column>
							<p:panelGrid columns="1">
								<div style="text-align: left;">Supplier:</div>
								<p:selectOneMenu value="#{repositoryBean.selectedSupplier}"
									style="min-width: 200px; max-width: 200px">
									<f:selectItem itemLabel="All" itemValue="" />
									<f:selectItems value="#{repositoryBean.suppliers}" var="sup"
										itemLabel="#{sup}" itemValue="#{sup}" />
								</p:selectOneMenu>
								<div style="text-align: left;">Category:</div>
								<p:selectOneMenu value="#{repositoryBean.selectedCategory}"
									style="min-width: 200px; max-width: 200px">
									<p:ajax event="change" update=":form:manufacturerSelect" />
									<f:selectItem itemLabel="All" itemValue="" />
									<f:selectItems value="#{repositoryBean.categories}" var="categ"
										itemLabel="#{categ}" itemValue="#{categ}" />
								</p:selectOneMenu>
								<div style="text-align: left;">Manufacturer:</div>
								<p:selectOneMenu id="manufacturerSelect"
									value="#{repositoryBean.selectedManufacturer}"
									style="min-width: 200px; max-width: 200px">
									<f:selectItem itemLabel="All" itemValue="" />
									<f:selectItems value="#{repositoryBean.manufacturers}"
										var="manuf" itemLabel="#{manuf}" itemValue="#{manuf}" />
								</p:selectOneMenu>
								<div style="text-align: left;">Class:</div>
								<p:selectOneMenu value="#{repositoryBean.selectedClass}"
									style="min-width: 200px; max-width: 200px">
									<f:selectItem itemLabel="All" itemValue="" />
									<f:selectItems value="#{repositoryBean.classes}" var="cl"
										itemLabel="#{cl}" itemValue="#{cl}" />
								</p:selectOneMenu>
								<p:commandButton value="Search" icon="ui-icon-search"
									actionListener="#{repositoryBean.loadItems}"
									update=":form:itemsTable" widgetVar="searchBtn"
									onclick="pb.start(); searchBtn.disable();" />
								<p:progressBar interval="100" widgetVar="pb" ajax="true"
									value="#{repositoryBean.progress}" labelTemplate="{value}%"
									styleClass="animated">
									<p:ajax event="complete"
										listener="#{repositoryBean.onComplete}" update=":form:message"
										oncomplete="searchBtn.enable()" />
								</p:progressBar>
							</p:panelGrid>
						</p:column>
						<p:column style="min-width: 900px;">
							<p:dataTable id="itemsTable" var="item"
								value="#{repositoryBean.items}" paginator="true" rows="10"
								emptyMessage="">
								<p:column headerText="Id" style=" font-size: 12pt;">
									<h:outputText value="#{item.id}" style=" font-size: 10pt;" />
								</p:column>
								<p:column headerText="Manufacturer" style=" font-size: 12pt;">
									<h:outputText value="#{item.manufacturer.name}"
										style=" font-size: 10pt;" />
								</p:column>
								<p:column headerText="Model" style=" font-size: 12pt;">
									<h:outputText value="#{item.model}" style=" font-size: 10pt;" />
								</p:column>
								<p:column headerText="Last date" style=" font-size: 12pt;">
									<h:outputText value="#{item.versionDate}"
										style=" font-size: 10pt;" />
								</p:column>
								<p:column headerText="Parameters" style=" font-size: 12pt;">
									<h:outputText value="#{item.params}" style=" font-size: 10pt;" />
								</p:column>
							</p:dataTable>
						</p:column>
					</p:row>
				</p:panelGrid>
			</h:form>
		</div>
	</ui:define>
</ui:composition>